import React, { Component } from 'react'
import * as pub from '../../config/public';
import * as fetch from '../../config/fetch';
import { Spin, message, DatePicker } from 'antd'
import Pages from '../Pages';
import moment from 'moment';
import { api_Ip } from '../../config/serverIp';

class VideoTimes extends Component {
    constructor(args) {
        super()
        this.state = {
            detailList: [],
            jumpPage: 1,
            loading: false
        }
    }
    show() {
        pub.loading(this, true);
        fetch.selectVideoTimes({
            currentPage: this.state.jumpPage
        }).then(data => {
            if (data.result === 'RC100') {
                this.setState({
                    detailList: data.selectVideoPalyTimes.pageItems,
                    totalPage: data.selectVideoPalyTimes.totalPage
                });
            } else {
                message.error(data.errMsg, 3);
                this.setState({
                    detailList: [],
                })
            }
            pub.loading(this, false);
        }, (res) => {
            pub.loading(this, false);
            pub.reject(res);
        })
    }
    componentDidMount() {
        this.show();
    }
    jump(page) {

        this.setState({
            jumpPage: page
        }, () => {
            this.show();
            //console.log(page);
        })
    }
    render() {
        return (
            <div style={{ marginTop: '-18px' }}>
                <div className="row tab pad-t-20">
                    <Spin spinning={this.state.loading} tip="加载列表中...">
                        <div style={{ minHeight: '300px' }} className="table-div bg-FFFFFF box-shadow mar-t-20">
                            <table>
                                <thead>
                                    <tr>
                                        <th>课程视频名称</th>
                                        <th>观看者姓名</th>
                                        <th>视频大小</th>
                                        <th>视频时长</th>
                                        <th>视频播放开始时间</th>
                                        <th>视频播放结束时间</th>
                                        <th>视频播放时长</th>
                                        <th>播放网络方式</th>
                                        <th>播放显示方式</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    {
                                        this.state.detailList.map((item, index) => {
                                            return (
                                                <tr key={index}>
                                                    <td>{item.courseVideoName}</td>
                                                    <td>{item.palyUserName}</td>
                                                    <td>{item.videoSize}M</td>
                                                    <td>{item.videoTimes}</td>
                                                    <td>{item.videoPalyStartTimes}</td>
                                                    <td>{item.videoPalyEndTimes}</td>
                                                    <td>{item.videoPalyTimes}</td>
                                                    <td>{item.palyInterWay}</td>
                                                    <td>{item.palyShowWay}</td>
                                                </tr>
                                            )
                                        })
                                    }
                                </tbody>
                            </table>
                        </div>
                    </Spin>
                </div>
                <Pages totalPage={this.state.totalPage} jump={this.jump.bind(this)} />
            </div>
        )
    }
}
class Statistics extends Component {
    constructor(args) {
        super()
        this.state = {
            jumpPage: 1,
            totalPage: 0,
            beginDate: moment(new Date(new Date() - 1000 * 60 * 60 * 24 * 7), 'YYYY/MM/DD').format('YYYY/MM/DD'),
            endDate: moment(new Date(), 'YYYY/MM/DD').format('YYYY/MM/DD'),
            loading: false,
            company: '',
            branch: '',
            detailList: []
        }
    }
    getReport() {
        if (!this.state.beginDate || !this.state.endDate) {
            message.warning('请输入有效时间', 3);
            return;
        }
        if (Date.parse(this.state.beginDate) > Date.parse(this.state.endDate)) {
            message.warning('起始时间不能大于截止时间，请输入有效时间', 3);
            return;
        }
        //    Date.parse(this.state.beginDate));
        pub.loading(this, true);
        fetch.getReport({ pageno: this.state.jumpPage, start: this.state.beginDate, end: this.state.endDate, company: this.state.company, branch: this.state.branch }).then((data) => {
            if (data.result === 'RC100') {
                this.setState({
                    detailList: data.data ? data.data : [],
                    totalPage: data.totalPage ? data.totalPage : 0
                });
            } else {
                message.error(data.errMsg, 3);
                this.setState({
                    detailList: [],
                })
            }
            pub.loading(this, false);
        }, (res) => {
            pub.loading(this, false);
            pub.reject(res);
            this.setState({
                detailList: [],
            })
        })
    }
    componentWillMount() {
        this.getReport();
    }
    jump(page) {
        this.setState({
            jumpPage: page
        }, () => {
            this.getReport();
        })
    }
    startChange(date, dateString) {
        this.setState({
            beginDate: dateString
        })
    }
    endChange(date, dateString) {
        this.setState({
            endDate: dateString,
        })
    }
    // downLoadreportexcel(){
    //      //pub.loading(this,true);
    //      fetch.downLoadreportexcel({pageno:this.state.jumpPage,start:this.state.beginDate,end:this.state.endDate,company:this.state.company,branch:this.state.branch}).then((data) => {
    // 		if(data.result==='RC100'){

    // 	   }else{
    //            message.error(data.errMsg, 3);
    // 	   }
    // 		//pub.loading(this,false);
    // 	},(res)=>{
    // 		//pub.loading(this,false);
    // 		pub.reject(res);
    // 	})
    //  }
    changeCompany(e) {
        this.setState({
            company: e.target.value
        })
    }
    changeBranch(e) {
        this.setState({
            branch: e.target.value
        })
    }
    render() {
        const dateFormat = 'YYYY/MM/DD';
        return (
            <div style={{ marginTop: '-18px' }}>
                <div className="row tab pad-t-20">
                    <div className="row bg-FFFFFF box-shadow">
                        <div className="query-main clearFix">
                            <div className="select">
                                <label>日期选择：</label>
                                <DatePicker onChange={this.startChange.bind(this)} format={dateFormat} placeholder="请选择开始日期" />
                                <span className="line-1"></span>
                                <DatePicker onChange={this.endChange.bind(this)} format={dateFormat} placeholder="请选择结束日期" />
                            </div>
                            <div className="select">
                                <label>机构选择：</label>
                                <select value={this.state.branch} onChange={this.changeBranch.bind(this)}>
                                    <option key={0} value={''}>全部</option>
                                    <option key={1} value={'1'}>总公司</option>
                                    <option key={2} value={'100'}>分公司</option>
                                    <option key={3} value={'10000'}>中支公司</option>
                                </select>
                            </div>
                            <div className="select">
                                <label>公司名称：</label>
                                <input type="text" value={this.state.company} onChange={this.changeCompany.bind(this)} placeholder="" />
                            </div>
                            <div className="query-btn">
                                <a className="btn-blue" onClick={this.getReport.bind(this)}>查询</a>
                                <a className="btn-blue"
                                    href={`${api_Ip}/report/downloadreportexcel?` + pub.url_parameter(pub.behavior({ pageno: this.state.jumpPage, start: this.state.beginDate, end: this.state.endDate, company: this.state.company, branch: this.state.branch }, 'getReport', 'menu'))}
                                    download={'统计表.xlxs'}
                                >导出</a>
                            </div>
                        </div>
                    </div>
                    <Spin spinning={this.state.loading} tip="加载列表中...">
                        <div style={{ minHeight: '300px' }} className="table-div bg-FFFFFF box-shadow mar-t-20">
                            <table>
                                <thead>
                                    <tr>
                                        <th>公司名称</th>
                                        <th>所属机构</th>
                                        <th>登录讲师人数</th>
                                        <th>登录学员数</th>
                                        <th>观看视频学员数</th>
                                        <th>课程数</th>
                                        <th>课程点赞数</th>
                                        <th>课程收藏数</th>
                                        <th>学员平均在线时长</th>
                                        <th>平均观看视频</th>
                                        <th>平均通过微课</th>
                                        <th>平均参加考试</th>
                                        <th>平均通过考试</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    {
                                        this.state.detailList.map((item, index) => {
                                            return (
                                                <tr key={index}>
                                                    <td>{item.company}</td>
                                                    <td>{item.branch}</td>
                                                    <td>{item.teacherLoginNum}</td>
                                                    <td>{item.studentLoginNum}</td>
                                                    <td>{item.studentWatchVidieNum}</td>
                                                    <td>{item.courseNum}</td>
                                                    <td>{item.colectNum}</td>
                                                    <td>{item.likeNum}</td>
                                                    <td>{item.studentOLTimeAVG}</td>
                                                    <td>{item.studentWatchVidieNumAVG}</td>
                                                    <td>{item.studentStudyCoursePassNumAVG}</td>
                                                    <td>{item.studentExamAVG}</td>
                                                    <td>{item.studentPassExamAVG}</td>
                                                </tr>
                                            )
                                        })
                                    }
                                </tbody>
                            </table>
                        </div>
                    </Spin>
                </div>
                <Pages totalPage={this.state.totalPage} jump={this.jump.bind(this)} />
            </div>
        )
    }
}
class Schedulest extends Component {
    constructor(props) {
        super(props);
        this.state = {
            code: '',
            userName: '',
            companyName: '',
            branchOfficeCode: '',
            activeIndex: this.props.activeIndex,
            jumpPage: 1,
            totalPage: 0,
            beginDate: "",
            endDate: "",
            loading: false,
            studentPager: [],
            teacherPager: []
        }
    }
    //学员
    studentsDetail() {
        // if(!this.state.beginDate||!this.state.endDate){
        // 	message.warning('请输入有效时间', 3);
        // 	return;
        // }
        if (Date.parse(this.state.beginDate) > Date.parse(this.state.endDate)) {
            message.warning('起始时间不能大于截止时间，请输入有效时间', 3);
            return;
        }
        pub.loading(this, true);
        fetch.studentsDetail({ pageno: this.state.jumpPage, beginDate: this.state.beginDate, endDate: this.state.endDate, userName: this.state.userName, companyName: this.state.companyName, branchOfficeCode: this.state.branchOfficeCode, code: this.state.code }).then((data) => {
            if (data.result === 'RC100') {
                this.setState({
                    studentPager: data.studentPager ? data.studentPager : [],
                    totalPage: data.totalPage ? data.totalPage : 0
                });
            } else {
                message.error(data.errMsg, 3);
                this.setState({
                    studentPager: [],
                })
            }
            pub.loading(this, false);
        }, (res) => {
            pub.loading(this, false);
            pub.reject(res);
            this.setState({
                studentPager: [],
            })
        })
    }
    //讲师
    teachersDetail() {
        // if(!this.state.beginDate||!this.state.endDate){
        // 	message.warning('请输入有效时间', 3);
        // 	return;
        //       }
        if (Date.parse(this.state.beginDate) > Date.parse(this.state.endDate)) {
            message.warning('起始时间不能大于截止时间', 3);
            return;
        }
        pub.loading(this, true);
        fetch.teachersDetail({ pageno: this.state.jumpPage, beginDate: this.state.beginDate, endDate: this.state.endDate, userName: this.state.userName, companyName: this.state.companyName, branchOfficeCode: this.state.branchOfficeCode, code: this.state.code }).then((data) => {
            if (data.result === 'RC100') {
                this.setState({
                    teacherPager: data.teacherPager ? data.teacherPager : [],
                    totalPage: data.totalPage ? data.totalPage : 0
                });
            } else {
                message.error(data.errMsg, 3);
                this.setState({
                    teacherPager: [],
                })
            }
            pub.loading(this, false);
        }, (res) => {
            pub.loading(this, false);
            pub.reject(res);
            this.setState({
                teacherPager: [],
            })
        })
    }
    componentWillMount() {
        if (this.state.activeIndex === 1) {

            fetch.studentsDetail({ pageno: this.state.jumpPage, beginDate: "", endDate: "", userName: this.state.userName, companyName: this.state.companyName, branchOfficeCode: this.state.branchOfficeCode, code: this.state.code }).then((data) => {
                if (data.result === 'RC100') {
                    this.setState({
                        studentPager: data.studentPager ? data.studentPager : [],
                        totalPage: data.totalPage ? data.totalPage : 0
                    });
                } else {
                    message.error(data.errMsg, 3);
                    this.setState({
                        studentPager: [],
                    })
                }
                pub.loading(this, false);
            }, (res) => {
                pub.loading(this, false);
                pub.reject(res);
                this.setState({
                    studentPager: [],
                })
            })
        } else {

            fetch.teachersDetail({ pageno: this.state.jumpPage, beginDate: "", endDate: "", userName: this.state.userName, companyName: this.state.companyName, branchOfficeCode: this.state.branchOfficeCode, code: this.state.code }).then((data) => {
                if (data.result === 'RC100') {
                    this.setState({
                        teacherPager: data.teacherPager ? data.teacherPager : [],
                        totalPage: data.totalPage ? data.totalPage : 0
                    });
                } else {
                    message.error(data.errMsg, 3);
                    this.setState({
                        teacherPager: [],
                    })
                }
                pub.loading(this, false);
            }, (res) => {
                pub.loading(this, false);
                pub.reject(res);
                this.setState({
                    teacherPager: [],
                })
            })
        }
    }
    jump(page) {
        this.setState({
            jumpPage: page
        }, () => {
            if (this.state.activeIndex === 1) {
                this.studentsDetail();
            } else {
                this.teachersDetail();
            }
        })
    }
    startChange(date, dateString) {
        this.setState({
            beginDate: dateString
        })
    }
    endChange(date, dateString) {
        this.setState({
            endDate: dateString,
        })
    }
    componentWillReceiveProps(nextProps) {
        this.setState({
            activeIndex: nextProps.activeIndex,
            code: '',
            userName: '',
            companyName: '',
            branchOfficeCode: '',
            jumpPage: 1,
            totalPage: 0,
            beginDate: "",
            endDate: "",
            loading: false,
            studentPager: [],
            teacherPager: []
        }, () => {
            if (this.state.activeIndex === 1) {
                fetch.studentsDetail({ pageno: this.state.jumpPage, beginDate: "", endDate: "", userName: this.state.userName, companyName: this.state.companyName, branchOfficeCode: this.state.branchOfficeCode, code: this.state.code }).then((data) => {
                    if (data.result === 'RC100') {
                        this.setState({
                            studentPager: data.studentPager ? data.studentPager : [],
                            totalPage: data.totalPage ? data.totalPage : 0
                        });
                    } else {
                        message.error(data.errMsg, 3);
                        this.setState({
                            studentPager: [],
                        })
                    }
                    pub.loading(this, false);
                }, (res) => {
                    pub.loading(this, false);
                    pub.reject(res);
                    this.setState({
                        studentPager: [],
                    })
                })
            } else {

                fetch.teachersDetail({ pageno: this.state.jumpPage, beginDate: "", endDate: "", userName: this.state.userName, companyName: this.state.companyName, branchOfficeCode: this.state.branchOfficeCode, code: this.state.code }).then((data) => {
                    if (data.result === 'RC100') {
                        this.setState({
                            teacherPager: data.teacherPager ? data.teacherPager : [],
                            totalPage: data.totalPage ? data.totalPage : 0
                        });
                    } else {
                        message.error(data.errMsg, 3);
                        this.setState({
                            teacherPager: [],
                        })
                    }
                    pub.loading(this, false);
                }, (res) => {
                    pub.loading(this, false);
                    pub.reject(res);
                    this.setState({
                        teacherPager: [],
                    })
                })
            }
        })
    }
    changeBranch(e) {
        this.setState({
            branchOfficeCode: e.target.value
        })
    }
    changeCompany(e) {
        this.setState({
            companyName: e.target.value
        })
    }
    changeuserName(e) {
        this.setState({
            userName: e.target.value
        })
    }
    changeCode(e) {
        this.setState({
            code: e.target.value
        })
    }

    render() {
        const dateFormat = 'YYYY/MM/DD';
        return (
            <div style={{ marginTop: '-18px' }}>
                <div className="row tab pad-t-20">
                    <div className="row bg-FFFFFF box-shadow">
                        <div className="query-main clearFix">
                            <div className="select">
                                <label>日期选择：</label>
                                <DatePicker onChange={this.startChange.bind(this)} format={dateFormat} placeholder="请选择开始日期" />
                                <span className="line-1"></span>
                                <DatePicker onChange={this.endChange.bind(this)} format={dateFormat} placeholder="请选择结束日期" />
                            </div>
                            <div className="select">
                                <label>机构选择：</label>
                                <select value={this.state.branchOfficeCode} onChange={this.changeBranch.bind(this)}>
                                    <option key={0} value={''}>全部</option>
                                    <option key={1} value={'1'}>总公司</option>
                                    <option key={2} value={'2'}>分公司</option>
                                    <option key={3} value={'3'}>中支公司</option>
                                </select>
                            </div>
                            <div className="select">
                                <label>公司名称：</label>
                                <input value={this.state.companyName} onChange={this.changeCompany.bind(this)} style={{ marginLeft: '1px' }} type="text" placeholder="" />
                            </div>
                            <div className="select">
                                {this.state.activeIndex === 1 ? <label>学员名字：</label> : <label>讲师名字：</label>}
                                <input value={this.state.userName} onChange={this.changeuserName.bind(this)} style={{ marginLeft: '1px' }} type="text" placeholder="" />
                            </div>
                            <div className="select">
                                {this.state.activeIndex === 1 ? <label>学员工号：</label> : <label>讲师工号：</label>}
                                <input value={this.state.code} onChange={this.changeCode.bind(this)} style={{ marginLeft: '1px' }} type="text" placeholder="" />
                            </div>
                            <div className="query-btn">
                                {
                                    this.state.activeIndex === 1 ?
                                        <a className="btn-blue" onClick={this.studentsDetail.bind(this)}>查询</a> :
                                        <a className="btn-blue" onClick={this.teachersDetail.bind(this)}>查询</a>
                                }
                                <a className="btn-blue"
                                    href={`${api_Ip}/download/downloadexcel?` + pub.url_parameter(pub.behavior({ pageno: this.state.jumpPage, beginDate: this.state.beginDate, endDate: this.state.endDate, userName: this.state.userName, companyName: this.state.companyName, branchOfficeCode: this.state.branchOfficeCode, code: this.state.code, fileName: this.state.activeIndex }, 'downloadExcel', 'button'))}
                                    download={'明细表.xlxs'}>导出</a>
                            </div>
                        </div>
                    </div>
                    <Spin spinning={this.state.loading} tip="加载列表中...">
                        <div className="table-div bg-FFFFFF box-shadow mar-t-20">
                            <table>
                                <thead>
                                    {
                                        this.state.activeIndex === 1 ?
                                            <tr>
                                                <th>序号</th>
                                                <th>学员工号</th>
                                                <th>姓名</th>
                                                <th>职级</th>
                                                <th>课程编号</th>
                                                <th>课程名称</th>
                                                <th>学习时间</th>
                                                <th>考试成绩</th>
                                                <th>讲师工号</th>
                                                <th>讲师名称</th>
                                            </tr> :
                                            <tr>
                                                <th>序号</th>
                                                <th>讲师工号</th>
                                                <th>姓名</th>
                                                <th>公司名称</th>
                                                <th>课程编号</th>
                                                <th>课程名称</th>
                                                <th>课程点赞数</th>
                                                <th>课程收藏数</th>
                                                <th>课程学员人数</th>
                                            </tr>
                                    }
                                </thead>
                                <tbody>
                                    {
                                        this.state.activeIndex === 1 ?
                                            (
                                                this.state.studentPager.map((item, index) => {
                                                    return (
                                                        <tr key={index}>
                                                            <td>{index}</td>
                                                            <td>{item.userName}</td>
                                                            <td>{item.student}</td>
                                                            <td>{item.branchOffice}</td>
                                                            <td>{item.examId}</td>
                                                            <td>{item.courseName == null ? "无" : item.courseName}</td>
                                                            <td>{item.createTime == null ? "无" : pub.formatTimestamp(item.createTime)}</td>
                                                            <td>{item.examScore}</td>
                                                            <td>{item.createUser == null ? "无" : item.createUser}</td>
                                                            <td>{item.teacher == null ? "无" : item.teacher}</td>
                                                        </tr>
                                                    )
                                                })
                                            )
                                            : (
                                                this.state.teacherPager.map((item, index) => {
                                                    return (
                                                        <tr key={index}>
                                                            <td>{index}</td>
                                                            <td>{item.userName}</td>
                                                            <td>{item.userRealName}</td>
                                                            <td>{item.branchOffice}</td>
                                                            <td>{item.id}</td>
                                                            <td>{item.courseName == null ? "无" : item.courseName}</td>
                                                            <td>{item.sumLike}</td>
                                                            <td>{item.sumCollection}</td>
                                                            <td>{item.sumClick}</td>
                                                        </tr>
                                                    )
                                                })
                                            )
                                    }
                                </tbody>
                            </table>
                        </div>
                    </Spin>
                </div>
                <Pages totalPage={this.state.totalPage} jump={this.jump.bind(this)} />
            </div>
        )
    }
}
class Schedulete extends Component {
    constructor(props) {
        super(props);
        this.state = {
            code: '',
            userName: '',
            companyName: '',
            branchOfficeCode: '',
            activeIndex: this.props.activeIndex,
            jumpPage: 1,
            totalPage: 0,
            beginDate: "",
            endDate: "",
            loading: false,
            studentPager: [],
            teacherPager: []
        }
    }
    //学员
    studentsDetail() {
        // if(!this.state.beginDate||!this.state.endDate){
        //  message.warning('请输入有效时间', 3);
        //  return;
        // }
        if (Date.parse(this.state.beginDate) > Date.parse(this.state.endDate)) {
            message.warning('起始时间不能大于截止时间，请输入有效时间', 3);
            return;
        }
        pub.loading(this, true);
        fetch.studentsDetail({ pageno: this.state.jumpPage, beginDate: this.state.beginDate, endDate: this.state.endDate, userName: this.state.userName, companyName: this.state.companyName, branchOfficeCode: this.state.branchOfficeCode, code: this.state.code }).then((data) => {
            if (data.result === 'RC100') {
                this.setState({
                    studentPager: data.studentPager ? data.studentPager : [],
                    //totalPage:data.totalPage?data.totalPage:0
                });
            } else {
                message.error(data.errMsg, 3);
                this.setState({
                    studentPager: [],
                })
            }
            pub.loading(this, false);
        }, (res) => {
            pub.loading(this, false);
            pub.reject(res);
            this.setState({
                studentPager: [],
            })
        })
    }
    //讲师
    teachersDetail() {
        // if(!this.state.beginDate||!this.state.endDate){
        //  message.warning('请输入有效时间', 3);
        //  return;
        //       }
        if (Date.parse(this.state.beginDate) > Date.parse(this.state.endDate)) {
            message.warning('起始时间不能大于截止时间', 3);
            return;
        }
        pub.loading(this, true);
        fetch.teachersDetail({ pageno: this.state.jumpPage, beginDate: this.state.beginDate, endDate: this.state.endDate, userName: this.state.userName, companyName: this.state.companyName, branchOfficeCode: this.state.branchOfficeCode, code: this.state.code }).then((data) => {
            if (data.result === 'RC100') {
                this.setState({
                    teacherPager: data.teacherPager ? data.teacherPager : [],
                    totalPage: data.totalPage ? data.totalPage : 0
                });
            } else {
                message.error(data.errMsg, 3);
                this.setState({
                    teacherPager: [],
                })
            }
            pub.loading(this, false);
        }, (res) => {
            pub.loading(this, false);
            pub.reject(res);
            this.setState({
                teacherPager: [],
            })
        })
    }
    componentWillMount() {
        if (this.state.activeIndex === 1) {

            fetch.studentsDetail({ pageno: this.state.jumpPage, beginDate: "", endDate: "", userName: this.state.userName, companyName: this.state.companyName, branchOfficeCode: this.state.branchOfficeCode, code: this.state.code }).then((data) => {
                if (data.result === 'RC100') {
                    this.setState({
                        studentPager: data.studentPager ? data.studentPager : [],
                        totalPage: data.totalPage ? data.totalPage : 0
                    });
                } else {
                    message.error(data.errMsg, 3);
                    this.setState({
                        studentPager: [],
                    })
                }
                pub.loading(this, false);
            }, (res) => {
                pub.loading(this, false);
                pub.reject(res);
                this.setState({
                    studentPager: [],
                })
            })
        } else {

            fetch.teachersDetail({ pageno: this.state.jumpPage, beginDate: "", endDate: "", userName: this.state.userName, companyName: this.state.companyName, branchOfficeCode: this.state.branchOfficeCode, code: this.state.code }).then((data) => {
                if (data.result === 'RC100') {
                    this.setState({
                        teacherPager: data.teacherPager ? data.teacherPager : [],
                        totalPage: data.totalPage ? data.totalPage : 0
                    });
                } else {
                    message.error(data.errMsg, 3);
                    this.setState({
                        teacherPager: [],
                    })
                }
                pub.loading(this, false);
            }, (res) => {
                pub.loading(this, false);
                pub.reject(res);
                this.setState({
                    teacherPager: [],
                })
            })
        }
    }
    jump(page) {
        this.setState({
            jumpPage: page
        }, () => {
            if (this.state.activeIndex === 1) {
                this.studentsDetail();
            } else {
                this.teachersDetail();
            }
        })
    }
    startChange(date, dateString) {
        this.setState({
            beginDate: dateString
        })
    }
    endChange(date, dateString) {
        this.setState({
            endDate: dateString,
        })
    }
    componentWillReceiveProps(nextProps) {
        this.setState({
            activeIndex: nextProps.activeIndex,
            code: '',
            userName: '',
            companyName: '',
            branchOfficeCode: '',
            jumpPage: 1,
            totalPage: 0,
            beginDate: "",
            endDate: "",
            loading: false,
            studentPager: [],
            teacherPager: []
        }, () => {
            if (this.state.activeIndex === 1) {
                fetch.studentsDetail({ pageno: this.state.jumpPage, beginDate: "", endDate: "", userName: this.state.userName, companyName: this.state.companyName, branchOfficeCode: this.state.branchOfficeCode, code: this.state.code }).then((data) => {
                    if (data.result === 'RC100') {
                        this.setState({
                            studentPager: data.studentPager ? data.studentPager : [],
                            totalPage: data.totalPage ? data.totalPage : 0
                        });
                    } else {
                        message.error(data.errMsg, 3);
                        this.setState({
                            studentPager: [],
                        })
                    }
                    pub.loading(this, false);
                }, (res) => {
                    pub.loading(this, false);
                    pub.reject(res);
                    this.setState({
                        studentPager: [],
                    })
                })
            } else {

                fetch.teachersDetail({ pageno: this.state.jumpPage, beginDate: "", endDate: "", userName: this.state.userName, companyName: this.state.companyName, branchOfficeCode: this.state.branchOfficeCode, code: this.state.code }).then((data) => {
                    if (data.result === 'RC100') {
                        this.setState({
                            teacherPager: data.teacherPager ? data.teacherPager : [],
                            totalPage: data.totalPage ? data.totalPage : 0
                        });
                    } else {
                        message.error(data.errMsg, 3);
                        this.setState({
                            teacherPager: [],
                        })
                    }
                    pub.loading(this, false);
                }, (res) => {
                    pub.loading(this, false);
                    pub.reject(res);
                    this.setState({
                        teacherPager: [],
                    })
                })
            }
        })
    }
    changeBranch(e) {
        this.setState({
            branchOfficeCode: e.target.value
        })
    }
    changeCompany(e) {
        this.setState({
            companyName: e.target.value
        })
    }
    changeuserName(e) {
        this.setState({
            userName: e.target.value
        })
    }
    changeCode(e) {
        this.setState({
            code: e.target.value
        })
    }

    render() {
        const dateFormat = 'YYYY/MM/DD';
        return (
            <div style={{ marginTop: '-18px' }}>
                <div className="row tab pad-t-20">
                    <div className="row bg-FFFFFF box-shadow">
                        <div className="query-main clearFix">
                            <div className="select">
                                <label>日期选择：</label>
                                <DatePicker onChange={this.startChange.bind(this)} format={dateFormat} placeholder="请选择开始日期" />
                                <span className="line-1"></span>
                                <DatePicker onChange={this.endChange.bind(this)} format={dateFormat} placeholder="请选择结束日期" />
                            </div>
                            <div className="select">
                                <label>机构选择：</label>
                                <select value={this.state.branchOfficeCode} onChange={this.changeBranch.bind(this)}>
                                    <option key={0} value={''}>全部</option>
                                    <option key={1} value={'1'}>总公司</option>
                                    <option key={2} value={'2'}>分公司</option>
                                    <option key={3} value={'3'}>中支公司</option>
                                </select>
                            </div>
                            <div className="select">
                                <label>公司名称：</label>
                                <input value={this.state.companyName} onChange={this.changeCompany.bind(this)} style={{ marginLeft: '1px' }} type="text" placeholder="" />
                            </div>
                            <div className="select">
                                {this.state.activeIndex === 1 ? <label>学员名字：</label> : <label>讲师名字：</label>}
                                <input value={this.state.userName} onChange={this.changeuserName.bind(this)} style={{ marginLeft: '1px' }} type="text" placeholder="" />
                            </div>
                            <div className="select">
                                {this.state.activeIndex === 1 ? <label>学员工号：</label> : <label>讲师工号：</label>}
                                <input value={this.state.code} onChange={this.changeCode.bind(this)} style={{ marginLeft: '1px' }} type="text" placeholder="" />
                            </div>
                            <div className="query-btn">
                                {
                                    this.state.activeIndex === 1 ?
                                        <a className="btn-blue" onClick={this.studentsDetail.bind(this)}>查询</a> :
                                        <a className="btn-blue" onClick={this.teachersDetail.bind(this)}>查询</a>
                                }
                                <a className="btn-blue"
                                    href={`${api_Ip}/download/downloadexcel?` + pub.url_parameter(pub.behavior({ pageno: this.state.jumpPage, beginDate: this.state.beginDate, endDate: this.state.endDate, userName: this.state.userName, companyName: this.state.companyName, branchOfficeCode: this.state.branchOfficeCode, code: this.state.code, fileName: this.state.activeIndex }, 'downloadExcel', 'button'))}
                                    download={'明细表.xlxs'}>导出</a>
                            </div>
                        </div>
                    </div>
                    <Spin spinning={this.state.loading} tip="加载列表中...">
                        <div className="table-div bg-FFFFFF box-shadow mar-t-20">
                            <table>
                                <thead>
                                    {
                                        this.state.activeIndex === 1 ?
                                            <tr>
                                                <th>序号</th>
                                                <th>学员工号</th>
                                                <th>姓名</th>
                                                <th>职级</th>
                                                <th>课程编号</th>
                                                <th>课程名称</th>
                                                <th>学习时间</th>
                                                <th>考试成绩</th>
                                                <th>讲师工号</th>
                                                <th>讲师名称</th>
                                            </tr> :
                                            <tr>
                                                <th>序号</th>
                                                <th>讲师工号</th>
                                                <th>姓名</th>
                                                <th>公司名称</th>
                                                <th>课程编号</th>
                                                <th>课程名称</th>
                                                <th>课程点赞数</th>
                                                <th>课程收藏数</th>
                                                <th>课程学员人数</th>
                                            </tr>
                                    }
                                </thead>
                                <tbody>
                                    {
                                        this.state.activeIndex === 1 ?
                                            (
                                                this.state.studentPager.map((item, index) => {
                                                    return (
                                                        <tr key={index}>
                                                            <td>{index}</td>
                                                            <td>{item.userName}</td>
                                                            <td>{item.student}</td>
                                                            <td>{item.branchOffice}</td>
                                                            <td>{item.examId}</td>
                                                            <td>{item.courseName == null ? "无" : item.courseName}</td>
                                                            <td>{item.createTime == null ? "无" : pub.formatTimestamp(item.createTime)}</td>
                                                            <td>{item.examScore}</td>
                                                            <td>{item.createUser == null ? "无" : item.createUser}</td>
                                                            <td>{item.teacher == null ? "无" : item.teacher}</td>
                                                        </tr>
                                                    )
                                                })
                                            )
                                            : (
                                                this.state.teacherPager.map((item, index) => {
                                                    return (
                                                        <tr key={index}>
                                                            <td>{index}</td>
                                                            <td>{item.userName}</td>
                                                            <td>{item.userRealName}</td>
                                                            <td>{item.branchOffice}</td>
                                                            <td>{item.id}</td>
                                                            <td>{item.courseName == null ? "无" : item.courseName}</td>
                                                            <td>{item.sumLike}</td>
                                                            <td>{item.sumCollection}</td>
                                                            <td>{item.sumClick}</td>
                                                        </tr>
                                                    )
                                                })
                                            )
                                    }
                                </tbody>
                            </table>
                        </div>
                    </Spin>
                </div>
                <Pages totalPage={this.state.totalPage} jump={this.jump.bind(this)} />
            </div>
        )
    }
}
class Statistical extends Component {
    constructor(args) {
        super()
        this.state = {
            activeIndex: 0
        }

    }

    render() {

        return (
            <div className="container">
                <div className="filter clearFix">
                    <ul className="filter-ul nav clearFix">
                        <li className={this.state.activeIndex === 0 ? 'active' : ''} onClick={() => { this.setState({ activeIndex: 0 }) }}><a>统计表</a></li>
                        <li className={this.state.activeIndex === 1 ? 'active' : ''} onClick={() => { this.setState({ activeIndex: 1 }) }}><a>学员明细表</a></li>
                        <li className={this.state.activeIndex === 2 ? 'active' : ''} onClick={() => { this.setState({ activeIndex: 2 }) }}><a>讲师明细表</a></li>
                        <li className={this.state.activeIndex === 3 ? 'active' : ''} onClick={() => { this.setState({ activeIndex: 3 }) }}><a>视频明细表</a></li>
                    </ul>
                </div>
                {(() => {
                    switch (this.state.activeIndex) {
                        case 0: return <Statistics />;
                        case 1: return <Schedulest activeIndex={1} />;
                        case 2: return <Schedulete activeIndex={2} />;
                        case 3: return <VideoTimes />
                        default: break;
                    }
                })()}
            </div>
        )
    }

}
export default Statistical

